import React from 'react';
import { Button } from 'antd';
import styles from './index.module.scss';
import { useHistory } from 'ice';

function ErrorPage(props: { code: number; text: string; hasReturn?: boolean }) {
  const { code = 404, text = '抱歉，您访问的页面不存在', hasReturn = true } = props;
  const history = useHistory();

  return (
    <div className="absolute inset-0 flex flex-row items-center justify-center">
      <img src={require(`./${code}.png`)} />
      <div className="flex flex-col items-center justify-center">
        <div className={styles['code']}>{code}</div>
        <div className={styles['text']}>{text}</div>
        <Button
          x-if={hasReturn}
          className={styles['button']}
          type="primary"
          size="large"
          onClick={() => history.push('/')}
        >
          返回首页
        </Button>
      </div>
    </div>
  );
}

export default ErrorPage;
